<template>
  <div>
    <el-form
      :inline="true"
      :model="formInline"
      class="demo-form-inline"
      @keyup.enter.native="search()"
    >
      <el-form-item label="活动名称">
        <br />
        <br />
        <el-input
          style="margin-left:-70px;width:200px"
          v-model="formInline.activityName"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="关联订单编号">
        <br />
        <br />
        <el-input
          style="margin-left:-85px;width:200px"
          v-model="formInline.keyword"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="会员名称">
        <br />
        <br />
        <el-input
          style="margin-left:-60px;width:200px"
          v-model="formInline.memberName"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="会员手机号">
        <br />
        <br />
        <el-input
          style="margin-left:-70px;width:200px"
          v-model="formInline.memberPhone"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="店铺授权编码">
        <br />
        <br />
        <el-input
          style="margin-left:-85px;width:200px"
          v-model="formInline.authCode"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="大区名称">
        <br />
        <br />
        <el-input
          style="margin-left:-70px;width:200px"
          v-model="formInline.warzoneName"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="营销区域名称">
        <br />
        <br />
        <el-input
          style="margin-left:-60px;width:200px"
          v-model="formInline.baseName"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="店铺名称">
        <br />
        <br />
        <el-input
          style="margin-left:-60px;width:200px"
          v-model="formInline.storeName"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="收货人手机号">
        <br />
        <br />
        <el-input
          style="margin-left:-85px;width:200px"
          v-model="formInline.receivePhone"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="收货人姓名">
        <br />
        <br />
        <el-input
          style="margin-left:-70px;width:200px"
          v-model="formInline.receiveName"
          clearable
        ></el-input>
      </el-form-item>

      <el-form-item label="赠品名称">
        <br />
        <br />
        <el-input
          style="margin-left:-70px;width:200px"
          v-model="formInline.giftName"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="赠品编码">
        <br />
        <br />
        <el-input
          style="margin-left:-60px;width:200px"
          v-model="formInline.giftCode"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item label="赠品类型">
        <br />
        <br />
        <el-select
          style="margin-left:-60px;width:200px"
          v-model="formInline.giftType"
          clearable
        >
          <el-option label="虚拟赠品" value="2"></el-option>
          <el-option label="实物赠品" value="1"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="赠品属性">
        <br />
        <br />
        <el-select
          style="margin-left:-60px;width:200px"
          v-model="formInline.giftProperty"
          clearable
        >
          <el-option label="普通赠品" value="1"></el-option>
          <el-option label="特殊赠品" value="2"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="赠送状态">
        <br />
        <br />
        <el-select
          style="margin-left:-60px;width:200px"
          v-model="formInline.status"
          clearable
        >
          <el-option label="待确认" value="1"></el-option>
          <el-option label="待发货" value="2"></el-option>
          <el-option label="已过期" value="3"></el-option>
          <el-option label="已完成" value="4"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="开始日期" v-show="showsx">
        <br />
        <br />
        <el-date-picker
          v-model="formInline.dateRange"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="创建开始日期"
          end-placeholder="创建结束日期"
          value-format="yyyy-MM-dd"
          :picker-options="pickerOptions"
          style="margin-left:-70px;width:290px"
        ></el-date-picker>
      </el-form-item>
      <div style="width:100%;display:flex;justify-content:flex-end;">
        <el-form-item>
          <el-button type="primary" @click="shaixuan()" size="mini">{{
            showval
          }}</el-button>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="search()"
            size="mini"
            icon="el-icon-search"
            >查询</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="kong()"
            size="mini"
            icon="el-icon-delete"
            >清空</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="selectSend2()"
            size="mini"
            :disabled="this.dataListSelections.length == 0"
            >批量发货</el-button
          >
          <el-button
            @click="exportExcel"
            style="margin-top: 0px;"
            size="mini"
            type="success"
            icon="el-icon-s-data"
            :loading="exportLoading"
            >导出</el-button
          >
          <el-button
            type="primary"
            @click="showConfigTableDialog()"
            size="mini"
            icon="el-icon-setting"
            :loading="insertLoading"
            >列表配置</el-button
          >
        </el-form-item>
      </div>
    </el-form>
    <el-table
      @selection-change="selectionChangeHandle"
      :data="tableData"
      style="margin-bottom: 20px;"
      height="400px"
      :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
      border
      v-loading="loading"
    >
      <el-table-column
        type="selection"
        :selectable="selectInit"
        width="55"
        align="center"
      ></el-table-column>
      <el-table-column
        type="index"
        label="序号"
        align="center"
        width="55"
      ></el-table-column>
      <el-table-column
        prop="giftOrderId"
        label="关联订单编号"
        align="left"
        width="180"
        show-overflow-tooltip
        v-if="isShow('giftOrderId')"
      ></el-table-column>
      <el-table-column
        prop="activityName"
        label="活动名称"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('activityName')"
      ></el-table-column>
      <el-table-column
        prop="giftCode"
        label="赠品编码"
        width="160"
        align="left"
        show-overflow-tooltip
        v-if="isShow('giftCode')"
      ></el-table-column>
      <el-table-column
        prop="giftType"
        label="赠品类型"
        width="180"
        align="center"
        show-overflow-tooltip
        v-if="isShow('giftType')"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.giftType != null">{{
            scope.row.giftType === 2 ? '虚拟赠品' : '实物赠品'
          }}</span>
          <span v-if="scope.row.giftType == null">-</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="giftProperty"
        label="赠品属性"
        width="180"
        align="center"
        show-overflow-tooltip
        v-if="isShow('giftProperty')"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.giftProperty != null">{{
            scope.row.giftProperty === 2 ? '特殊虚拟赠品' : '普通虚拟赠品'
          }}</span>
          <span v-if="scope.row.giftProperty == null">-</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="giftName"
        label="赠品名称"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('giftName')"
      ></el-table-column>
      <el-table-column
        prop="receiveTime"
        label="赠品有效期"
        width="180"
        align="center"
        show-overflow-tooltip
        v-if="isShow('receiveTime')"
      >
        <template slot-scope="scope">
          <span
            v-if="
              scope.row.validBeginDate != null || scope.row.validEndDate != null
            "
            >{{ scope.row.validBeginDate + '-' + scope.row.validEndDate }}</span
          >
          <span
            v-if="
              scope.row.validBeginDate == null && scope.row.validEndDate == null
            "
            >-</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="status"
        label="赠送状态"
        width="160"
        align="center"
        show-overflow-tooltip
        v-if="isShow('status')"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.status != null && scope.row.status == 1">{{
            '待确认'
          }}</span>
          <span v-if="scope.row.status != null && scope.row.status == 2">{{
            '待发货'
          }}</span>
          <span v-if="scope.row.status != null && scope.row.status == 4">{{
            '已完成'
          }}</span>
          <span v-if="scope.row.status != null && scope.row.status == 3">{{
            '已过期'
          }}</span>
          <span
            v-if="
              scope.row.status != null &&
                (scope.row.status == 1 || scope.row.status == 5)
            "
            >-</span
          >
          <span v-if="scope.row.status == null">-</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="goodsName"
        label="购买商品"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('goodsName')"
      ></el-table-column>
      <el-table-column
        prop="deliveryType"
        label="配送方式"
        width="160"
        align="center"
        show-overflow-tooltip
        v-if="isShow('deliveryType')"
      >
        <template slot-scope="scope">
          <span
            v-if="scope.row.giftType != 2 && scope.row.deliveryType != null"
            >{{
              scope.row.deliveryType === 1 ? '五粮液总部配送' : '专卖店配送'
            }}</span
          >
          <span v-if="scope.row.deliveryType == null">-</span>
          <span v-if="scope.row.giftType == 2">-</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="memberName"
        label="会员名称"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('memberName')"
      ></el-table-column>
      <el-table-column
        prop="memberPhone"
        label="手机号码"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('memberPhone')"
      ></el-table-column>
      <el-table-column
        prop="memberInfo"
        label="用户信息详情"
        width="180"
        show-overflow-tooltip
        align="left"
        v-if="isShow('memberInfo')"
      ></el-table-column>
      <el-table-column
        prop="receiveName"
        label="收货人姓名"
        width="180"
        align="center"
        show-overflow-tooltip
        v-if="isShow('receiveName')"
      >
        <template slot-scope="scope">
          <span
            v-if="scope.row.receiveName != null && scope.row.giftType !== 2"
            >{{ scope.row.receiveName }}</span
          >
          <span v-if="scope.row.receiveName == null || scope.row.giftType === 2"
            >-</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="receivePhone"
        label="收货人手机号码"
        width="180"
        align="center"
        show-overflow-tooltip
        v-if="isShow('receivePhone')"
      >
        <template slot-scope="scope">
          <span
            v-if="scope.row.receivePhone != null && scope.row.giftType !== 2"
            >{{ scope.row.receivePhone }}</span
          >
          <span
            v-if="scope.row.receivePhone == null || scope.row.giftType === 2"
            >-</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="receiveAddress"
        label="收货地址"
        width="280"
        align="center"
        show-overflow-tooltip
        v-if="isShow('receiveAddress')"
      >
        <template slot-scope="scope">
          <span
            v-if="scope.row.receiveAddress != null && scope.row.giftType !== 2"
            >{{ scope.row.receiveAddress }}</span
          >
          <span
            v-if="scope.row.receiveAddress == null || scope.row.giftType === 2"
            >-</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="warzoneName"
        label="大区名称"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('warzoneName')"
      ></el-table-column>
      <el-table-column
        prop="baseName"
        label="营销区域名称"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('baseName')"
      ></el-table-column>
      <el-table-column
        prop="authCode"
        label="店铺授权编码"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('authCode')"
      ></el-table-column>
      <el-table-column
        prop="storeName"
        label="店铺名称"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('storeName')"
      ></el-table-column>
      <el-table-column
        prop="createTime"
        label="创建时间"
        width="180"
        align="left"
        show-overflow-tooltip
        v-if="isShow('createTime')"
      ></el-table-column>
    </el-table>
    <el-form :inline="true" :model="formInline">
      <el-form-item style="margin-top: 6px;"></el-form-item>
    </el-form>
    <div class="block" style="margin-top:-49px">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 20, 30, 50, 100, 150, 200]"
        :current-page="listQuery.current"
        :page-size="listQuery.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>

    <!--列表配置-->
    <el-dialog
      title="列表配置"
      :visible.sync="configTableDialogVisible"
      width="50%"
      @close="closeConfigTableDialog()"
    >
      <div id="configTableDiv">
        <el-form :inline="true" :model="formInline2" class="demo-form-inline">
          <el-form-item label="选择列表字段：">
            <el-checkbox
              :indeterminate="formInline2.isIndeterminate"
              v-model="formInline2.isAll"
              style="margin-top:10px;"
              @change="isAllFieldChange"
              >全选</el-checkbox
            >
          </el-form-item>
          <el-divider></el-divider>
          <el-checkbox-group
            v-model="userMenuShowFields"
            @change="isSingleFieldChange"
          >
            <el-checkbox
              v-for="item in userMenuFieldList"
              :label="item.fieldCode"
              :key="item.fieldCode"
              style="margin:15px 10px;width:120px;"
              >{{ item.fieldName }}</el-checkbox
            >
          </el-checkbox-group>
        </el-form>
        <el-row>
          <el-col :span="24" style="text-align: center;margin-top: 30px">
            <el-button type="info" @click="closeConfigTableDialog()" size="mini"
              >取 消</el-button
            >
            <el-button
              type="primary"
              @click="insertUserFieldRelation()"
              size="mini"
              >确 认</el-button
            >
          </el-col>
        </el-row>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getmemberrule } from '@/api/membergrade';
import {
  queryWinningRecordList,
  batchDeliverGoods,
  queryWinningRecordListExcel,
} from '@/api/memberPrice';
import imageUpload from '@/page/common/Image-upload';
import qs from 'qs';
import FileSaver from 'file-saver';
import XLSX from 'xlsx';
import {
  queryUserMenuFieldByParam,
  insertUserFieldRelation,
} from '@/api/tradeOrderSearch';
export default {
  data() {
    return {
      showsx: false,
      showval: '展开筛选条件',
      options: [],
      tableData: [],
      tableDataExcel: [],
      shopLevelList: [],
      dataListSelections: [],
      lsGoodsList: [],
      loading: true,
      exportLoading: false,
      insertLoading: false,
      total: 0,
      listQuery: {
        current: 1,
        size: 100,
      },
      total2: 0,
      listQuery2: {
        current: 1,
        size: 100,
      },
      dialogVisible: false,
      dialogVisibleLevel: false,
      formInline: {
        keyword: '',
        memberName: '',
        memberPhone: '',
        authCode: '',
        warzoneName: '',
        baseName: '',
        storeName: '',
        receivePhone: '',
        receiveName: '',
        activityName: '',
        status: '',
        giftName: '',
        giftCode: '',
        giftType: '',
        giftProperty: '',
        status: '',
        deliveryType: '',
        isDeliver: '',
        gradelevelId: '',
        prizeLevelId: '',
        dateRange: [],
      },
      rules: {},
      configTableDialogVisible: false, //列表配置弹窗状态
      formInline2: {
        isIndeterminate: false, //是否半选中
        isAll: true, //是否全部显示,
        menuCode: 'giftActivityRecords',
      },
      userMenuFieldList: [], //全部列名列表
      userMenuAllFields: [], //全部的列名
      userMenuShowFields: [], //显示的列名
      pickerOptions: {
        shortcuts: [
          {
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            },
          },
          {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            },
          },
          {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            },
          },
        ],
      },
    };
  },
  mounted() {
    this.queryUserMenuFieldByParam();
    this.getDataList();
    this._getmemberinfo();
  },
  components: {
    imageUpload,
  },
  created() {},
  methods: {
    shaixuan() {
      if (this.showsx == false) {
        this.showsx = true;
        this.showval = '筛选条件关闭';
      } else {
        this.showsx = false;
        this.showval = '筛选条件展开';
      }
    },
    kong() {
      this.formInline.keyword = '';
      this.formInline.memberName = '';
      this.formInline.memberPhone = '';
      this.formInline.warzoneName = '';
      this.formInline.authCode = '';
      this.formInline.baseName = '';
      this.formInline.storeName = '';
      this.formInline.receivePhone = '';
      this.formInline.receiveName = '';
      this.formInline.activityName = '';
      this.formInline.giftName = '';
      this.formInline.giftCode = '';
      this.formInline.status = '';
      this.formInline.status = '';
      this.formInline.deliveryType = '';
      this.formInline.isDeliver = '';
      this.formInline.giftType = '';
      this.formInline.giftProperty = '';
      this.formInline.dateRange = [];
    },
    search() {
      this.loading = true;
      this.listQuery.current = 1;
      let data = {
        size: this.listQuery.size,
        current: this.listQuery.current,
        condition: {
          giftOrderId: this.formInline.keyword.trim(),
          memberName: this.formInline.memberName.trim(),
          memberPhone: this.formInline.memberPhone.trim(),
          authCode: this.formInline.authCode.trim(),
          warzoneName: this.formInline.warzoneName.trim(),
          baseName: this.formInline.baseName.trim(),
          storeName: this.formInline.storeName.trim(),
          receivePhone: this.formInline.receivePhone.trim(),
          receiveName: this.formInline.receiveName.trim(),
          activityName: this.formInline.activityName.trim(),
          giftName: this.formInline.giftName.trim(),
          giftCode: this.formInline.giftCode.trim(),
          giftProperty: this.formInline.giftProperty,
          status: this.formInline.status,
          deliveryType: this.formInline.deliveryType,
          isDeliver: this.formInline.isDeliver,
          giftType: this.formInline.giftType,
          validBeginDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 0
              ? this.formInline.dateRange[0]
              : '',
          validEndDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 1
              ? this.formInline.dateRange[1]
              : '',
        },
      };
      queryWinningRecordList(data).then((res) => {
        this.loading = false;
        this.total = res.total;
        this.tableData = res.records;
      });
    },
    handleSizeChange(val) {
      this.listQuery.size = val;
      this.getDataList();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
      this.getDataList();
    },

    getDataList() {
      let data = {
        size: this.listQuery.size,
        current: this.listQuery.current,
        condition: {
          giftOrderId: this.formInline.keyword.trim(),
          memberName: this.formInline.memberName.trim(),
          memberPhone: this.formInline.memberPhone.trim(),
          authCode: this.formInline.authCode.trim(),
          warzoneName: this.formInline.warzoneName.trim(),
          baseName: this.formInline.baseName.trim(),
          storeName: this.formInline.storeName.trim(),
          receivePhone: this.formInline.receivePhone.trim(),
          receiveName: this.formInline.receiveName.trim(),
          activityName: this.formInline.activityName.trim(),
          giftName: this.formInline.giftName.trim(),
          giftCode: this.formInline.giftCode.trim(),
          giftProperty: this.formInline.giftProperty,
          status: this.formInline.status,
          deliveryType: this.formInline.deliveryType,
          isDeliver: this.formInline.isDeliver,
          giftType: this.formInline.giftType,
          validBeginDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 0
              ? this.formInline.dateRange[0]
              : '',
          validEndDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 1
              ? this.formInline.dateRange[1]
              : '',
        },
      };
      queryWinningRecordList(data).then((res) => {
        this.loading = false;
        this.total = res.total;
        this.tableData = res.records;
      });
    },

    // 多选表1
    selectionChangeHandle(val) {
      this.dataListSelections = val;
    },

    _getmemberinfo() {
      let data = {
        size: 99,
        current: 1,
        condition: {},
        ascs: [],
        descs: [],
      };
      getmemberrule(data).then((res) => {
        this.options = res.records;
      });
    },

    selectSends() {
      this.dialogVisibleLevel = !this.dialogVisibleLevel;
      this.getShopLevelList();
    },
    getShopLevelList() {
      this.loading = true;
      let data = {
        size: this.listQuery2.size,
        current: this.listQuery2.current,
        condition: {
          isDeliver: 0,
        },
        ascs: [],
        descs: [],
      };
      queryWinningRecordList(data).then((res) => {
        this.shopLevelList = res.records;
        this.total2 = res.total;
      });
      this.loading = false;
    },

    goodsChecked(row) {
      this.lsGoodsList = row;
    },

    handleSizeChange2(val) {
      this.listQuery2.size = val;
      this.getShopLevelList();
    },
    handleCurrentChange2(val) {
      this.listQuery2.current = val;
      this.getShopLevelList();
    },
    selectConfirm() {
      // 保存已选择的
      let data = [];
      this.lsGoodsList.forEach((item, i) => {
        let obj = { uuid: item.uuid };
        data.push(obj);
      });
      let ids = data.join(',');
      batchDeliverGoods(ids).then((res) => {
        this.$message({
          showClose: true,
          message: res.message,
          type: res.code == 1 ? 'success' : 'error',
        });
        this.dialogVisibleLevel = !this.dialogVisibleLevel;
      });
    },
    selectSend2() {
      // 保存已选择的
      let data = [];
      this.dataListSelections.forEach((item, i) => {
        data.push(item.uuid);
      });
      let ids = data.join(',');
      batchDeliverGoods(ids).then((res) => {
        this.$message({
          showClose: true,
          message: res.code == 1 ? '操作成功' : '操作失败',
          type: res.code == 1 ? 'success' : 'error',
        });
        this.getDataList();
      });
    },
    selectBlur(e) {
      this.formInline.prizeLevelId = e.target.value;
    },
    getDataListExcel() {
      let data = {
        size: this.total,
        current: 1,
        condition: {
          giftOrderId: this.formInline.keyword,
          memberName: this.formInline.memberName,
          memberPhone: this.formInline.memberPhone,
          authCode: this.formInline.authCode,
          warzoneName: this.formInline.warzoneName,
          baseName: this.formInline.baseName,
          storeName: this.formInline.storeName,
          receivePhone: this.formInline.receivePhone,
          receiveName: this.formInline.receiveName,
          activityName: this.formInline.activityName,
          giftName: this.formInline.giftName,
          giftCode: this.formInline.giftCode,
          giftProperty: this.formInline.giftProperty,
          status: this.formInline.status,
          deliveryType: this.formInline.deliveryType,
          isDeliver: this.formInline.isDeliver,
          giftType: this.formInline.giftType,
          validBeginDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 0
              ? this.formInline.dateRange[0]
              : '',
          validEndDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 1
              ? this.formInline.dateRange[1]
              : '',
        },
      };
      queryWinningRecordList(data).then((res) => {
        if (res.code == 1) {
          this.tableDataExcel = res.records;
          if (this.tableDataExcel.length > 0) {
            this.exportExcel();
          } else {
            this.$message.error('数据为空无法导出!');
          }
        }
        setTimeout(() => {
          this.exportLoading = false;
        }, 3000);
      });
    },
    exportToo() {
      this.exportLoading = true;
      this.getDataListExcel();
    },
    exportExcel1() {
      var that = this;
      //要导出去的标题
      var arry = [
        [
          '序号',
          '会员名称',
          '会员等级',
          '手机号码',
          '活动名称',
          '赠品等级',
          '赠品名称',
          '赠品类型',
          '中奖时间',
          '发货时间',
          '配送时间',
          '所属专卖店(授权编码)',
          '专卖店地址',
          '领奖人姓名',
          '领奖人手机号码',
          '领奖人收货地址',
          '配送状态',
          '配送方式',
          '发货状态',
        ],
      ];
      // that.Data指要导出的数据
      that.tableDataExcel
        .map((a, i) => {
          var _arry = [];
          _arry.push((1 + i).toString());
          _arry.push(a.memberName == null ? '' : a.memberName.toString());
          _arry.push(
            a.memberLevelName == null ? '' : a.memberLevelName.toString()
          );
          _arry.push(a.memberPhone == null ? '' : a.memberPhone.toString());
          _arry.push(a.activityName == null ? '' : a.activityName.toString());
          _arry.push(
            a.prizeLevelName == null ? '' : a.prizeLevelName.toString()
          );
          _arry.push(a.prizeName == null ? '' : a.prizeName.toString());
          _arry.push(
            a.giftType == null ? '' : a.giftType == 2 ? '虚拟赠品' : '实物赠品'
          );
          _arry.push(a.winningTime == null ? '' : a.winningTime); //格式化日期没有就返回空
          _arry.push(a.deliverTime == null ? '' : a.deliverTime); //格式化日期没有就返回空
          _arry.push(a.receiveTime == null ? '' : a.receiveTime); //格式化日期没有就返回空
          _arry.push(
            a.storeName == null
              ? ''
              : a.authCode == null
              ? '【' + a.storeName.toString() + '()】'
              : '【' +
                a.storeName.toString() +
                '(' +
                a.authCode.toString() +
                ')】'
          );
          _arry.push(a.storeAddress == null ? '' : a.storeAddress.toString());
          _arry.push(a.name == null ? '' : a.name.toString());
          _arry.push(a.tel == null ? '' : a.tel.toString());
          _arry.push(a.address == null ? '' : a.position + ' ' + a.address);
          _arry.push(
            a.giftType == 2
              ? ''
              : a.status == 0
              ? '已下单'
              : a.status == 1
              ? '待确认'
              : a.status == 2
              ? '待发货'
              : a.status == 3
              ? '已过期'
              : a.status == 4
              ? '已完成'
              : a.status == 5
              ? '已取消'
              : ''
          );
          _arry.push(
            a.giftType == 2
              ? ''
              : a.deliveryType == 1
              ? '专卖店配送'
              : a.deliveryType == 2
              ? '五粮液总部配送'
              : ''
          );
          _arry.push(
            a.giftType == 2 ? '' : a.isDeliver == 1 ? '已发货' : '未发货'
          );
          return _arry;
        })
        .forEach((a) => {
          arry.push(a);
        });
      var sheet = XLSX.utils.aoa_to_sheet(arry);
      //循环单元格设置样式
      var s = sheet['!ref'];
      sheet['A2'].s = {
        font: {
          name: '宋体',
          sz: 18,
          color: { rgb: '#FFFF0000' },
          bold: true,
          italic: false,
          underline: false,
        },
        alignment: {
          horizontal: 'center',
          vertical: 'center',
        },
      };
      var rows = s.substr(s.length - 1, 1);
      var cloums = [
        'A',
        'B',
        'C',
        'D',
        'E',
        'F',
        'G',
        'H',
        'I',
        'J',
        'K',
        'L',
        'M',
        'N',
        'O',
        'P',
        'Q',
        'R',
        'S',
      ];
      for (var j = 0; j < cloums.length; j++) {
        for (var i = 1; i <= rows; i++) {
          if (i == 1) {
            sheet[cloums[j] + i].s = {
              //样式
              font: {
                bold: true,
                italic: false,
                underline: false,
              },
              alignment: {
                horizontal: 'left',
                vertical: 'left',
                wrap_text: false,
              },
            };
          } else {
            sheet[cloums[j] + i].s = {
              //样式
              alignment: {
                horizontal: 'left',
                vertical: 'left',
                wrap_text: false,
              },
            };
          }
        }
      }
      sheet['!cols'] = [
        {
          wpx: 90,
        },
        {
          wpx: 90,
        },
        {
          wpx: 90,
        },
        {
          wpx: 90,
        },
        {
          wpx: 150,
        },
        {
          wpx: 150,
        },
        {
          wpx: 150,
        },
        {
          wpx: 180,
        },
        {
          wpx: 150,
        },
        {
          wpx: 150,
        },
        {
          wpx: 150,
        },
        {
          wpx: 180,
        },
        {
          wpx: 320,
        },
        {
          wpx: 150,
        },
        {
          wpx: 120,
        },
        {
          wpx: 480,
        },
        {
          wpx: 120,
        },
        {
          wpx: 120,
        },
        {
          wpx: 480,
        },
        {
          wpx: 120,
        },
        {
          wpx: 120,
        },
        {
          wpx: 120,
        },
        {
          wpx: 120,
        },
      ]; //单元格列宽
      this.openDownloadDialog(
        this.sheet2blob(sheet),
        new Date().toLocaleDateString() + '会员中奖记录表.xlsx'
      );
    },
    sheet2blob(sheet, sheetName) {
      sheetName = sheetName || 'sheet1';
      var workbook = {
        SheetNames: [sheetName],
        Sheets: {},
      };
      workbook.Sheets[sheetName] = sheet;
      // 生成excel的配置项
      var wopts = {
        bookType: 'xlsx', // 要生成的文件类型
        bookSST: false, // 是否生成Shared String Table，官方解释是，如果开启生成速度会下降，但在低版本IOS设备上有更好的兼容性
        type: 'binary',
      };
      var wbout = XLSX.write(workbook, wopts);
      var blob = new Blob([s2ab(wbout)], { type: 'application/octet-stream' });
      // 字符串转ArrayBuffer
      function s2ab(s) {
        var buf = new ArrayBuffer(s.length);
        var view = new Uint8Array(buf);
        for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;
        return buf;
      }
      return blob;
    },

    openDownloadDialog(url, saveName) {
      if (typeof url == 'object' && url instanceof Blob) {
        url = URL.createObjectURL(url); // 创建blob地址
      }
      var aLink = document.createElement('a');
      aLink.href = url;
      aLink.download = saveName || ''; // HTML5新增的属性，指定保存文件名，可以不要后缀，注意，file:///模式下不会生效
      var event;
      if (window.MouseEvent) event = new MouseEvent('click');
      else {
        event = document.createEvent('MouseEvents');
        event.initMouseEvent(
          'click',
          true,
          false,
          window,
          0,
          0,
          0,
          0,
          0,
          false,
          false,
          false,
          false,
          0,
          null
        );
      }
      aLink.dispatchEvent(event);
    },
    exportExcel() {
      let data = {
        // size: this.listQuery.size,
        // current: this.listQuery.current,
        // condition: {
        giftOrderId: this.formInline.keyword,
        memberName: this.formInline.memberName,
        memberPhone: this.formInline.memberPhone,
        authCode: this.formInline.authCode,
        warzoneName: this.formInline.warzoneName,
        baseName: this.formInline.baseName,
        storeName: this.formInline.storeName,
        receivePhone: this.formInline.receivePhone,
        receiveName: this.formInline.receiveName,
        activityName: this.formInline.activityName,
        giftName: this.formInline.giftName,
        giftCode: this.formInline.giftCode,
        giftProperty: this.formInline.giftProperty,
        status: this.formInline.status,
        deliveryType: this.formInline.deliveryType,
        isDeliver: this.formInline.isDeliver,
        giftType: this.formInline.giftType,
        validBeginDate:
          this.formInline.dateRange !== null &&
          this.formInline.dateRange.length > 0
            ? this.formInline.dateRange[0]
            : '',
        validEndDate:
          this.formInline.dateRange !== null &&
          this.formInline.dateRange.length > 1
            ? this.formInline.dateRange[1]
            : '',
        // },
        // ascs: [],
        // descs: []
      };
      queryWinningRecordListExcel(data)
        .then((res) => {
          const link = document.createElement('a');
          let blob = new Blob([res], { type: 'application/vnd.ms-excel' });
          link.style.display = 'none';
          //设置连接
          link.href = URL.createObjectURL(blob);
          link.download = '赠品记录列表.xlsx';
          document.body.appendChild(link);
          //模拟点击事件
          link.click();
        })
        .catch((err) => {
          console.log(err);
        });
    },

    selectInit(row, index) {
      if (row.giftType == 2) {
        return false; //不可勾选
      } else {
        return true; //可勾选
      }
    },
    //显示配置弹窗
    showConfigTableDialog() {
      this.configTableDialogVisible = true;
    },
    //关闭配置弹窗
    closeConfigTableDialog() {
      this.queryUserMenuFieldByParam();
      this.configTableDialogVisible = false;
    },
    //获取列表字段列表
    queryUserMenuFieldByParam() {
      let data = {
        menuCode: this.formInline2.menuCode,
      };
      this.userMenuAllFields = []; //全部的列名
      this.userMenuShowFields = []; //显示的列名
      queryUserMenuFieldByParam(data).then((res) => {
        this.userMenuFieldList = res.records;
        this.userMenuFieldList.forEach((item, index) => {
          this.userMenuAllFields.push(item.fieldCode);
          if (item.isShow == 1) {
            this.userMenuShowFields.push(item.fieldCode);
          }
        });
        if (
          this.userMenuShowFields.length == 0 ||
          this.userMenuShowFields.length == this.userMenuAllFields.length
        ) {
          this.userMenuShowFields = this.userMenuAllFields;
          this.formInline2.isAll = true;
        } else {
          this.formInline2.isAll = false;
          this.formInline2.isIndeterminate = true;
        }
      });
    },
    //保存显示字段
    insertUserFieldRelation() {
      if (
        this.userMenuShowFields == null ||
        this.userMenuShowFields.length == 0
      ) {
        this.$message({
          showClose: true,
          message: '列表字段不可为空',
          type: 'info',
        });
        return;
      }
      let data = {
        menuCode: this.formInline2.menuCode,
        fieldList: this.userMenuShowFields,
      };
      this.insertLoading = true;
      insertUserFieldRelation(data).then((res) => {
        this.insertLoading = false;
        if (res.code == 1) {
          this.$message({
            showClose: true,
            message: res.message,
            type: 'success',
          });
          this.closeConfigTableDialog();
        } else {
          this.$message({
            showClose: true,
            message: res.message,
            type: 'error',
          });
        }
      });
    },
    //是否全选字段
    isAllFieldChange(val) {
      this.userMenuShowFields = val ? this.userMenuAllFields : [];
      this.formInline2.isIndeterminate = false;
    },
    //是否选中单个字段
    isSingleFieldChange(val) {
      let checkedCount = this.userMenuShowFields.length;
      this.formInline2.isAll = checkedCount === this.userMenuAllFields.length;
      this.formInline2.isIndeterminate =
        checkedCount > 0 && checkedCount < this.userMenuAllFields.length;
    },
    //获取字段勾选状态
    getUserMenuFieldStatus(fieldCode) {
      if (this.userMenuShowFields != null) {
        for (let i = 0; i < this.userMenuShowFields.length; i++) {
          if (this.userMenuShowFields[i] == fieldCode) {
            return true;
          }
        }
        return false;
      }
    },
    //是否显示字段
    isShow(fieldCode) {
      if (this.formInline2.isAll || this.getUserMenuFieldStatus(fieldCode)) {
        return true;
      } else {
        return false;
      }
    },
    //流导出
    exportExcel() {
      let data = {
        size: this.total,
        current: 1,
        condition: {
          giftOrderId: this.formInline.keyword,
          memberName: this.formInline.memberName,
          memberPhone: this.formInline.memberPhone,
          authCode: this.formInline.authCode,
          warzoneName: this.formInline.warzoneName,
          baseName: this.formInline.baseName,
          storeName: this.formInline.storeName,
          receivePhone: this.formInline.receivePhone,
          receiveName: this.formInline.receiveName,
          activityName: this.formInline.activityName,
          giftName: this.formInline.giftName,
          giftCode: this.formInline.giftCode,
          giftProperty: this.formInline.giftProperty,
          status: this.formInline.status,
          deliveryType: this.formInline.deliveryType,
          isDeliver: this.formInline.isDeliver,
          giftType: this.formInline.giftType,
          validBeginDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 0
              ? this.formInline.dateRange[0]
              : '',
          validEndDate:
            this.formInline.dateRange !== null &&
            this.formInline.dateRange.length > 1
              ? this.formInline.dateRange[1]
              : '',
        },
      };
      this.exportLoading = true;
      queryWinningRecordListExcel(data).then((res) => {
        this.exportLoading = false;
        let blob = new Blob([res], { type: 'application/vnd.ms-excel' });
        const link = document.createElement('a');
        link.style = 'display:none';
        link.href = URL.createObjectURL(blob);
        link.download = new Date().toLocaleDateString() + '赠品中奖记录表.xlsx';
        document.body.appendChild(link);
        link.click();
      });
    },
  },
};
</script>
<style lang="less" scoped>
.el-form-item .el-select {
  width: 100%;
}
#configTableDiv .el-divider--horizontal {
  margin-top: 0;
}
</style>
